import { saveLogo } from "@/api/modules/user";
import { GlobalStore } from "@/stores";
import { PublicStore } from "@/stores/modules/public";
import { openWin } from "@/utils/routerUtil";
import { showTips } from "@/utils/util";
export const UserDomain = defineComponent({
	setup() {
		const globalStore = GlobalStore();
		const publicStore = PublicStore();
		const state = reactive<any>({
			home: globalStore.setting.home
		});
		const save = async () => {
			if (state.home && !state.home.startsWith("http")) {
				state.home = "http://" + state.home;
			}
			let { code, message } = await saveLogo({
				systemName: globalStore.setting.systemName,
				logo: globalStore.setting.logo,
				home: state.home
			});
			let ok = showTips(code, "个性化设置", message);
			if (ok) {
				globalStore.setHome(state.home);
			}
		};
		const gotoPage = () => {
			let token = "";
			if (RegExp(/\?.+=.*/).test(globalStore.setting.home)) {
				token = `&token=${publicStore.token}`;
			} else {
				token = `/#/?token=${publicStore.token}`;
			}
			openWin(globalStore.setting.home + token);
		};
		return () => {
			return (
				<>
					<div class="bg-white pl-8 pr-8 pt-2">
						<div class="block-title border-bottom">
							<span>用户空间</span>
						</div>
						<div class="p-4 mt-2 ">
							<el-alert closable={false} type="error">
								警告：默认主页配置错误，会导致系统无法使用，请确保地址能正常访问。
							</el-alert>
							<el-form label-width="120px" class="pt-3">
								<el-form-item label="默认主页">
									<el-input v-model={state.home} placeholder="http://ssiot.cc:9000">
										{{
											append: () => {
												return globalStore.setting.home ? (
													<el-link type="primary" onClick={gotoPage}>
														访问
													</el-link>
												) : null;
											}
										}}
									</el-input>
								</el-form-item>

								<el-form-item>
									<el-button type="primary" onClick={save}>
										保存
									</el-button>
								</el-form-item>
							</el-form>
						</div>
					</div>
				</>
			);
		};
	}
});
